<!-- Child.vue -->
<script setup>

/* 
它可以像其他 ref 一样被访问以及修改，不过它能起到在父组件和当前变量之间的双向绑定的作用：
  它的 .value 和父组件的 v-model 的值同步；
  当它被子组件变更了，会触发父组件绑定的值一起更新。
*/
const model = defineModel()

function update() {
  model.value++
}
</script>

<template>
  <div>Parent bound v-model is: {{ model }}</div>
  <button @click="update">Increment</button>
</template>